import React from 'react';
import { message, Form, Row, Col,Modal,Input} from 'antd';
import { connect } from 'dva';
import styles from './index.less';

const FormItem = Form.Item;

@Form.create()
class ExportOrder extends React.Component {

    constructor(props) {
        super(props);
        this.state = {
            visible: false,
            data: {}
        }
    }

    componentWillMount() {
        window.Isoption = false;
      }
      componentDidMount() {
        window.Isoption = true;
      }

    // 确定
    handleOk = () => {
        const { _this } = this.props;
        const { dispatch, taskName, data} = this.props;
        dispatch({
            type: 'orderList/ExportOrderList',
            payload: {
                ProductWord: data && data.ProductWord ? data.ProductWord : '',
                MemberWord: data && data.MemberWord ? data.MemberWord : '',
                OrderNo: data && data.OrderNo ? data.OrderNo : '',
                MinDate: data && data.MinDate? data.MinDate: null,
                MaxDate: data && data.MaxDate? data.MaxDate: null,
                DeliveryType: data && data.DeliveryType? data.DeliveryType: 0,
                OrderStatus: data && data.OrderStatus? data.OrderStatus: 0, //订单状态
                RightsStatus: data && data.RightsStatus? data.RightsStatus: 0, //维权状态
                PaymentChannel: data && data.PaymentChannel? data.PaymentChannel: 0, //支付方式
                Sort: data.Sort==='descend'?'Desc':'Asc',
                TaskNumber: taskName.TaskNumber,
            },
            callBack: {
                success: res=> {
                    if(res.Code ===0) {
                        message.success('提交成功');
                        _this.setState({
                            visible: false
                        })
                    }
                },
                error: res => {
                    message.error(res.Msg)
                }
            }
        })
    };

    handleCancel = () => {
        const { _this } = this.props;
        _this.setState({ visible: false }, () => {
            this.forceUpdate();
        });
    };

    render() {
        const {visible, data, taskName, loading1} = this.props;
        const OrderStatus = ['全部','待付款','待发货','已发货','退款中','已完成','已关闭'];
        const DeliveryType =['全部','快递发货','同城配送','上门自提'];
        const RightsStatus = ['全部','退款处理中','退款结束'];
        const PaymentChannel = ['全部','微信支付','货到付款','线下支付','到店付款'];
        const {getFieldDecorator} = this.props.form;
        const formItemLayout = {
            labelCol: {
                span: 3,
              },
              wrapperCol: {
                span: 21,
              },
          }
          const formItemLayout2= {
            labelCol: {
                span: 6,
              },
              wrapperCol: {
                span: 17,
              },
          }
          const title = (
            <div>
                <span>订单数据导出</span>
                <span className="xkd-color-margin8">今天还可以导出{taskName.AvailableTimes}次</span>
            </div>
        );
        return (
            <Form>
                <Modal
                   visible={visible}
                   title={title}
                   onOk={this.handleOk}
                   onCancel={this.handleCancel}
                   confirmLoading={loading1}
                   width={640}
                   okText="确定导出"
                >
                    <div className={`${styles.exportModal}`}>
                        <div className={`${styles.rowBody} xkd-color-f7`}>
                            <FormItem
                                label="下单时间"
                                {...formItemLayout}
                            >
                                <span>{data.MinDate +'~'+ data.MaxDate}</span>
                            </FormItem>
                            <Row>
                                <Col span={12}>
                                    <FormItem
                                        {...formItemLayout2}
                                        label="	商品信息"
                                    >
                                        <span>{data&&data.ProductWord?data.ProductWord:'-'}</span>
                                    </FormItem>
                                </Col>
                                <Col span={12}>
                                    <FormItem
                                        {...formItemLayout2}
                                        label="订单号"
                                    >
                                        <span>{data&&data.OrderNo?data.OrderNo:'-'}</span>
                                    </FormItem>
                                </Col>
                            </Row>
                            <Row>
                                <Col span={12}>
                                    <FormItem
                                        {...formItemLayout2}
                                        label="	客户信息"
                                    >
                                        <span>{data&&data.MemberWord?data.MemberWord:'-'}</span>
                                    </FormItem>
                                </Col>
                                <Col span={12}>
                                    <FormItem
                                        {...formItemLayout2}
                                        label="订单状态"
                                    >
                                        <span>{OrderStatus[data.OrderStatus]}</span>
                                    </FormItem>
                                </Col>
                            </Row>
                            <Row>
                                <Col span={12}>
                                    <FormItem
                                        {...formItemLayout2}
                                        label="配送方式"
                                    >
                                        <span>{DeliveryType[data.DeliveryType]}</span>
                                    </FormItem>
                                </Col>
                                <Col span={12}>
                                    <FormItem
                                        {...formItemLayout2}
                                        label="维权状态"
                                    >
                                        <span>{RightsStatus[data.RightsStatus]}</span>
                                    </FormItem>
                                </Col>
                            </Row>
                            <Row>
                                <Col span={12}>
                                    <FormItem
                                        {...formItemLayout2}
                                        label="支付方式"
                                    >
                                        <span>{PaymentChannel[data.PaymentChannel]}</span>
                                    </FormItem>
                                </Col>
                            </Row>
                        </div>
                        <FormItem
                                label="任务名称"
                                {...formItemLayout}
                                style={{marginTop: 16}}
                            >
                            {getFieldDecorator('name', {
                                initialValue: `${taskName.TaskTypeName}${taskName.TaskNumber}`,
                                rules: [{required: true, message: '此项为必选项'}]
                            })(<Input disabled style={{marginLeft: 4}}/>)
                            }
                        </FormItem>
                    </div>
                </Modal>
            </Form>
        )
    }
}

export default connect(({orderList, global, loading}) =>({
    taskName: orderList.taskName,
    loading1: loading.effects['orderList/ExportOrderList'],
}))(ExportOrder)
